<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>账户充值和提现申请</title>
    <link rel="stylesheet" href="./css/bootstrap.min.css">
    <link rel="stylesheet" href="./css/index.css">
    <link rel="stylesheet" href="./css/finance.css">
    <link rel="stylesheet" href="./css/recharge&cash.css">
    <script src="https://cdn.bootcss.com/jquery/2.0.0/jquery.min.js"></script>
    <script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa"
        crossorigin="anonymous"></script>
    <style>
        
    </style>
</head>

<body>
    <!-- 导航与背景 -->
    <div class="container-fulid firstHead">
        <nav class="navbar navbar-inverse">
            <div class="container">
                <!-- Brand and toggle get grouped for better mobile display -->
                <div class="navbar-header">
                    <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1"
                        aria-expanded="false">
                        <span class="sr-only">Toggle navigation</span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                    </button>
                    <a class="navbar-brand" href="#">
                        <img src="images/logo.png" alt="">
                        <span>果粒多数字商品抵押</span>
                    </a>
                </div>
                <!-- Collect the nav links, forms, and other content for toggling -->
                <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
                    <ul class="nav navbar-nav navbar-right">
                        <li>
                            <a href="./index.html">首页</a>
                        </li>
                        <li>
                            <a href="./finance.html">我要赎回</a>
                        </li>
                        <li>
                            <a class="active" href="./finance.html">财务中心</a>
                        </li>
                        <li>
                            <a href="./person.html">个人中心</a>
                        </li>
                        <li>
                            <a href="./login.html" class="entry">登录</a>
                        </li>
                        <li>
                            <a href="./register.html" class="register">注册</a>
                        </li>
                        <li>
                            <a href="#" class="notice">公告</a>
                        </li>
                        <li>
                            <a href="./help.html" class="help">帮助</a>
                        </li>
                    </ul>
                </div>
                <!-- /.navbar-collapse -->
            </div>
            <!-- /.container-fluid -->
        </nav>
    </div>
    <!-- 我的账户充值和申请提现 -->
    <div class="container-fulid graybg">
        <div class="container">
            <ul class="nav nav-tabs" id="my-tab" role="tablist">
                <li role="presentation">
                    <a href="./finance.html" role="tab" class="glyphicon glyphicon-chevron-left"></a>
                </li>
                <li role="presentation" class="active">
                    <a href="#reCharge" aria-controls="reCharge" role="tab" data-toggle="tab">账户充值</a>
                </li>
                <li role="presentation">
                    <a href="#cash" aria-controls="cash" role="tab" data-toggle="tab">申请提现</a>
                </li>
            </ul>
            <div class="tab-content">
                <div role="tabpanel" class="tab-pane active bgColor3" id="reCharge">
                    <!-- 这是账户充值的内容 -->
                    <form action="" class="form-horizontal">
                        <div class="form-group">
                            <label for="sum" class="col-md-2 text-right">充值金额</label>
                            <div class="col-md-3">
                                <input type="text" class="form-control" id="sum" placeholder="请输入金额">
                                <p class="form-control-static">最低充值1元起</p>
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="" class="col-md-2 text-right">充值方式</label>
                            <div class="col-md-10">
                                <p class="form-control-static col-md-3 bank industry">工商银行</p>
                                <p class="form-control-static col-md-3 bank farming">农业银行</p>
                                <p class="form-control-static col-md-3 bank build">建设银行</p>
                                <p class="form-control-static col-md-3 bank china">中国银行</p>

                                <p class="form-control-static col-md-3 bank post">中国邮政</p>
                                <p class="form-control-static col-md-3 bank business">招商银行</p>
                                <p class="form-control-static col-md-3 bank livehood">民生银行</p>
                                <p class="form-control-static col-md-3 bank traffic">交通银行</p>

                                <p class="form-control-static col-md-3 bank safety">平安银行</p>
                                <p class="form-control-static col-md-3 bank societe">兴业银行</p>
                                <p class="form-control-static col-md-3 bank gf">广发银行</p>
                                <select name="" id="" class="col-md-3 others">
                                    <!-- <option value="0">其他银行</option> -->
                                    <option value="1">北京银行</option>
                                    <option value="2">南京银行</option>
                                    <option value="3">渤海银行</option>
                                    <option value="4">东亚银行</option>
                                    <option value="5">宁波银行</option>
                                </select>
                            </div>
                        </div>
                        <div class="form-group">
                            <div class="col-md-offset-2 col-md-3">
                                <button type="submit" class="btn btn-warning bank2">下一步</button>
                            </div>
                        </div>
                    </form>
                    <div class="clearfix"></div>
                </div>
                <div role="tabpanel" class="tab-pane" id="cash">
                    <!-- 这是申请提现的内容 -->
                    <div class="bgColor2">
                        <form action="" class="form-horizontal">
                            <div class="form-group">
                                <label for="sum2" class="col-md-2 control-label">体现金额</label>
                                <div class="col-md-3">
                                    <input type="text" class="form-control" id="sum2" placeholder="请输入金额">
                                    <p class="form-control-static">最少提现100元起</p>
                                </div>
                            </div>
                            <div class="form-group">
                                <label for="" class="col-md-2 text-right">提现方式</label>
                                <div class="col-md-10">
                                    <p class="form-control-static col-md-3 bank industry">工商银行</p>
                                    <p class="form-control-static col-md-3 bank farming">农业银行</p>
                                    <p class="form-control-static col-md-3 bank build">建设银行</p>
                                    <p class="form-control-static col-md-3 bank china">中国银行</p>

                                    <p class="form-control-static col-md-3 bank post">中国邮政</p>
                                    <p class="form-control-static col-md-3 bank business">招商银行</p>
                                    <p class="form-control-static col-md-3 bank livehood">民生银行</p>
                                    <p class="form-control-static col-md-3 bank traffic">交通银行</p>
                                </div>
                            </div>
                            <div class="form-group">
                                <label for="deposit" class="col-md-2 control-label">开户行</label>
                                <div class="col-md-10">
                                    <input type="text" id="deposit" class="form-control" placeholder="请输入开户行全程">
                                </div>
                            </div>
                            <div class="form-group">
                                <label for="cardNumber" class="col-md-2 control-label">银行卡号</label>
                                <div class="col-md-5">
                                    <input type="text" class="form-control" id="cardNumber" placeholder="请输入银行卡号">
                                </div>
                            </div>
                            <div class="form-group">
                                <label for="name" class="col-md-2 control-label">开户姓名</label>
                                <div class="col-md-5">
                                    <input type="text" class="form-control" id="name" placeholder="请输入您的开户姓名">
                                </div>
                            </div>
                            <div class="form-group">
                                <label for="name" class="col-md-2 control-label">手机号码</label>
                                <div class="col-md-5">
                                    <input type="text" class="form-control" id="name" placeholder="请输入到账接收通知手机号码">
                                </div>
                            </div>
                            <div class="form-group">
                                <div class="col-md-offset-2 col-md-2">
                                    <button type="submit" class="btn btn-warning btn-block">立即申请</button>
                                    <p class="form-control-static text-center">预计24小时之内到账</p>
                                </div>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- footer -->
    <div class="base container-fulid">
        <div class="container">
            <p class="qq pull-left">QQ群:
                <span>66666666</span>
            </p>
            <p class="email pull-left hidden-xs">邮箱:
                <span>guolicheng@163.com</span>
            </p>
            <p class="copyright pull-right hidden-xs hidden-sm">虚拟物品抵押平台 copyright @ 2017 - 2020 xuniwupindiya.All Rights Reserved版权所有</p>
        </div>
    </div>
    <script>
        $(function () {
            let allHeight = $(window).height();
            let topHeight = $('.firstHead').height();
            let footHeight = $('.base').height();
            let bgHeight = parseInt(allHeight - topHeight - footHeight);
            $('#my-tab li').click(function () {
                if ($(this).index() == '1') {
                    $('.graybg').height(bgHeight);
                } else {
                    $('.graybg').height('auto');
                }
            })
        })
        $('.bank').click(function () {
            $(this).addClass('selected').siblings('.bank').removeClass('selected');
        })
        $('.others').change(function () {
            $('.bank').removeClass('selected');
        })
    </script>
</body>

</html>